<template>
    <el-dialog
      title='追加铸币'
      :close-on-click-modal="false"
      :visible.sync="visible"
      top="19vh"
      class="natice-dialog"
    >
      <el-form
        ref="dataForm"
        :rules="rules"
        :model="dataForm"
        label-position="left"
        label-width="100px"
        style="margin: 0 20px;"
      >
        <!--DAW denom名称-->
        <el-form-item label="DAW denom名称:" prop="denomName" label-width="130px">
          <el-input v-model="dataForm.denomName" :disabled="true"/>
        </el-form-item>
        <!--DAW denom名称-->
        <el-form-item label="DAW名称:" prop="dawName" label-width="130px">
          <el-input v-model="dataForm.dawName" :disabled="true" />
        </el-form-item>
        <el-form-item label="已铸DAW数量:" prop="count" label-width="130px">
          <el-input v-model="dataForm.count" :disabled="true" />
        </el-form-item>
        <!--DAW denom名称-->
        <el-form-item label="追加DAW数量:" prop="addcount" label-width="130px">
          <el-input v-model="dataForm.addcount" placeholder="请输入追加DAW数量" />
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="visible = false">
          取消
        </el-button>
        <el-button type="primary" @click="dataFormSubmit()" :loading="loading">
          确认
        </el-button>
      </div>
    </el-dialog>
  </template>

  <script>
  // import * as api from '@/api/product/attr'

  export default {
    data() {
      return {
        visible: false,
        loading: false,
        dataForm: {
          denomName: '',
          dawName: '',
          count: '',
          addcount: ''
        },
        rules: {
          addcount: [{ required: true, message: '追加数量不能为空', trigger: 'blur' }, { max: 4, message: '数量超上限' }]
        }
      }
    },
    methods: {
      init(row) {
        this.dataForm.id = row.id
        this.dataForm.denomName = row.denomName
        this.dataForm.dawName = row.dawName
        this.dataForm.count = row.count
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (!this.dataForm.id) {
            return
          }
        })
      },
      // 表单提交
      dataFormSubmit() {
        this.$refs.dataForm.validate(valid => {
          if (!valid) {
            return
          }
          this.loading = true
          const request = api.addToNft(this.dataForm)
          request.then(data => {
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
                this.visible = false
                this.loading = false
                this.$emit('refreshDataList')
                this.$refs['dataForm'].resetFields()
              }
            })
          })
        })
      }
    }
  }
  </script>

  <style lang="scss" scoped>
    .natice-dialog {
      .el-dialog {
        min-width: 60%;
      }

      .el-dialog__body {
        padding: 10px 20px;
      }
    }
  </style>
